$(function () {
    let list = $(".ss_list")
    let list1 = $(".ss_list_bg")
    list.hover(function () {
        list1.slideDown()
    }, function () {
        list1.slideUp()
    })

    //所搜框
    $(".s_ipt").focus(function () {
        $(".s_ipt").attr("placeholder", '')
    })
    $(".s_ipt").blur(function () {
        $(".s_ipt").attr("placeholder", '请输入关键字')
    })
    $(".s_btn").click(function () {
        let v = $(".s_ipt").val().trim()
        if (!v || v.length === 0) {
            alert("搜索不能为空！")
        }
    })

    //轮播图
    var mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal', // 水平切换选项
        loop: true, // 循环模式选项

        autoplay: true,//等同于以下设置
        autoplay: {
            delay: 1000,
            effect: 'fade',
            stopOnLastSlide: false,
            disableOnInteraction: true,
        }, //可选选项 自动滑动
        effect: 'cube',
        cubeEffect: {
            slideShadows: true,
            shadow: true,
            shadowOffset: 100,
            shadowScale: 0.6
        },
        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
        }
    })

    $(".fj").hover(function () {
        $(this).next().show()
    }, function () {
        $(this).next().hide()
    })


    //右侧文字滚动
    let ul = $('#express')
    ul.hover(function () {
        stop()
    }, function () {
        start()
    })
    let id
    function start() {
        id = setInterval(function () {
            let li = $("#express>li:first")
            let top = parseInt(li.css("margin-top"));
            top--
            li.css("margin-top", top + "px");
            if (top < -30) {
                li.css("margin-top", "0px");
                $("#express").append(li)
            }
        }, 50)
    }
    start()
    function stop() {
        clearInterval(id)
    }



    function fn2() {
        //购物车
        $('.i_car').hover(function () {
            $(".last").css({ display: 'block' })
        },
            function () {
                $(".last").css({ display: 'none' })
            })
        //减号的操作
        $(".J_btnDelCount").each(function () {
            //获取单价并转换成js
            let m = $(this).parent().next()[0].innerHTML
            //截取后面一位
            m = m.substring(1)
            //获取input值并转换成js
            let n = $(this).next()[0].value
            //计算单价
            m = m / n
            console.log(m);
            //on动态添加
            $(this).on('click', function () {
                //重新获取input
                n = $(this).next()[0].value
                //减减操作
                n--
                //判断是否小于0
                if (n <= 0) {
                    //重新赋值next下
                    $(this).next()[0].value = 1
                } else {
                    //大于1时执行下一步对input进行赋值
                    $(this).next()[0].value = n
                    //计算单个总价并转换成js输入内容
                    $(this).parent().next()[0].innerHTML = `￥${m * n}`
                    //计算单个总数向页面输出{parent()返回父级元素}
                    let a = $(this).parent().parent().parent().parent().parent()
                    a.find('h4 span')[0].innerHTML = `共${n}件商品`
                    //计算所有的总价
                    fn()
                    //计算所有的总数
                    fn1()
                }

            })
        })
        //加号操作
        $(".J_btnAddCount").each(function () {
            //获取单价并转换成js
            let m = $(this).parent().next()[0].innerHTML
            //截取后面一位
            m = m.substring(1)
            //on动态添加
            $(this).on('click', function () {
                //获取find()找子元素，括号里面是找的有该属性的元素
                let n = $(this).parent().find('input')[0].value
                //加加操作
                n++
                //对input进行重新赋值
                $(this).parent().find('input')[0].value = n
                //计算单个总价并转换成js输入内容
                $(this).parent().next()[0].innerHTML = `￥${m * n}`
                //计算单个总数向页面输出{parent()返回父级元素}
                let a = $(this).parent().parent().parent().parent().parent()
                a.find('h4 span')[0].innerHTML = `共${n}件商品`
                //计算所有的总价
                fn()
                //计算所有的总数
                fn1()
            })

        })

        //删除
        //遍历页面中的叉号
        $(".J_btnDelete").each(function () {
            //on动态添加
            $(this).on('click', function () {
                let flag2 = confirm('确认删除该商品吗？')
                if (flag2) {
                    //remove()移出元素
                    $(this).parent().parent().parent().parent().remove()
                    //计算所有的总价
                    fn()
                    //计算所有的总数
                    fn1()
                    //判断一个元素是否存在用他的length属性
                    if ($(".J_btnDelete").length === 0) {
                        $('.noshop').show()
                    }
                }
            })
        })
    }
    fn2()
    //合计
    function fn() {
        //声明一个变量用于保存值
        let num = 0
        //遍历所有单个的总价
        $('.J_smallTotalPrice').each(function () {
            //获取值
            let s = $(this)[0].innerHTML
            //截取字符并累加赋值
            num += parseInt(s.substring(1))
        })
        // console.log(num);
        //向页面合计总价输出内容
        $('.J_totalPrice')[0].innerHTML = `￥${num}`
    }

    //结算
    function fn1() {
        //声明一个常量进行累加保存
        let sum = 0
        //遍历所有的单个数量
        $(".J_inputCount").each(function () {
            //累加保存所有的单个数量
            sum += parseInt($(this)[0].value)
        })
        // console.log(sum);
        //向页面中输出总数量
        $(".J_totalCount")[0].innerHTML = `(${sum})`
    }

    //商品分类弹框
    $(".fj").parent().each(function () {
        $(this).hover(function () {
            $(this).find('.zj').css({ display: 'block' })
        },
            function () {
                $(this).find('.zj').css({ display: 'none' })
            })
    })
})
$(function () {
    //商品滚动 向左
    let feature = $('#feature')
    let id
    $('.h_prev').click(function () {
        id = setInterval(function () {
            let li = $('.featureBox:first')
            let left = parseInt(li.css('margin-left'))
            left -= 10
            li.css('margin-left', left + "px")
            if (left < -li.width()) {
                li.css('margin-left', "0px")
                $('.featureUL').append(li)
                clearInterval(id)
            }
        }, 50)
    })

    //向右滚动
    $(".h_next").click(function () {
        //找到最后一个li
        let lastLi = $(".featureUL>li:last")
        //把最后的li 放到ul最前面
        $(".featureUL").prepend(lastLi)
        //找到第一个li
        let li = $(".featureUL>li:first")
        //给第一个li设置margin-left 为-243px
        li.css('margin-left', '-243px')
        //把li的margin-left转为数值型
        let marginLeft = parseInt(li.css("margin-left"))
        //启动定时器
        id = setInterval(function () {
            //找到第一个li
            li = $(".featureUL>li:first")
            marginLeft += 10
            console.log(marginLeft)
            if (marginLeft >= 0) {
                clearInterval(id)
                $(".featureUL").prepend(li)

            }
            li.css("margin-left", marginLeft + "px")
        }, 50)
    })
})